<template>
	<view style="padding-bottom: 40rpx;">
		<!-- visible -->
		<!-- isCurrent_residence 现居地 -->
		<cityPicker :column="column" :default-value="formData.current_residence" :mask-close-able="maskCloseAble" @confirm="confirm" @cancel="isCurrent_residence=false" :visible="isCurrent_residence"/>
		<cityPicker :column="column" :default-value="formData.census_register" :mask-close-able="maskCloseAble" @confirm="confirmcensus_register" @cancel="iscensus_register=false" :visible="iscensus_register"/>
		
		<cityPicker :column="column" :default-value="formData.operational_field" :mask-close-able="maskCloseAble" @confirm="confirmoperational_field" @cancel="isoperational_field=false" :visible="isoperational_field"/>
		<view class="borde-padd-24">
			<view class="tab-anv-conter ">
				<view class="tab-anv-list flex-height-between">
					<view class="title">真实姓名</view>
					<view class="flex-line-height tab-anv-list-right">
						<input type="text" v-model="formData.nickname" placeholder="请输入">
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">性别</view>
					<view class="flex-line-height flex-height-between tab-anv-list-right">
						<pickerConter @onChange="onChange" :array="gender" rangeKey="name" :tabIndex="genderIndex"></pickerConter>
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">出生日期</view>
					<view class="flex-line-height flex-height-between tab-anv-list-right">
						<picker mode="date" :end="endDate" :value="date" fields="day" @change="bindDateChange">
							<view class="uni-input">{{date}}</view>
						</picker> 
						<image class="img" :src="imgUrl+'/right.png'" mode=""></image>
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">政治面貌</view>
					<!-- dangUXns -->
					<picker @change="dangUXnsFun" :range="dangUXns">
						<view class="flex-line-height flex-height-between tab-anv-list-right">
							<view class="uni-input">{{formData.politics_status || '请选择' }}</view>
							<image class="img" :src="imgUrl+'/right.png'" mode=""></image>
						</view>
					</picker>
					<!-- <view class="flex-line-height tab-anv-list-right">
						<input type="text" v-model="formData.politics_status" placeholder="请输入">
					</view> -->
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">现居住地</view>
					<view @click="isCurrent_residence=!isCurrent_residence" class="flex-line-height flex-height-between tab-anv-list-right">
						<text v-if="formData.current_residence&&formData.current_residence.length">
							{{formData.current_residence.join()}}
						</text>
						<text v-else>请选择</text>
						<image class="img" :src="imgUrl+'/right.png'" mode=""></image>
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">户口所在地</view>
					<view @click="iscensus_register=!iscensus_register" class="flex-line-height flex-height-between tab-anv-list-right">
						<text v-if="formData.census_register&&formData.census_register.length">
							{{formData.census_register.join()}}
						</text>
						<text v-else>请选择</text>
						<image class="img" :src="imgUrl+'/right.png'" mode=""></image>
					</view>
					<!-- <view class="flex-line-height tab-anv-list-right">
						<input type="text" v-model="formData.census_register" placeholder="请输入">
					</view> -->
					<!--  -->
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">电子邮箱</view>
					<view class="flex-line-height tab-anv-list-right">
						<input type="text" v-model="formData.email" placeholder="请输入">
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">最高学历</view>
					<picker @change="funCsiy" :range="xueliScone">
						<view class="flex-line-height flex-height-between tab-anv-list-right">
							<view class="uni-input">{{formData.education || '请选择' }}</view>
							<image class="img" :src="imgUrl+'/right.png'" mode=""></image>
						</view>
					</picker>
					
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">毕业时间</view>
					<view class="flex-line-height flex-height-between tab-anv-list-right">
						<picker mode="date" :end="endDate" :value="date2" fields="day" @change="bindDateChange2">
							<view class="uni-input">{{date2}}</view>
						</picker> 
						<image class="img" :src="imgUrl+'/right.png'" mode=""></image>
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">期望职位</view>
					<view class="flex-line-height tab-anv-list-right">
						<input type="text"  v-model="formData.expected_position" placeholder="请输入">
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">工作地区</view>
					<!-- <view class="flex-line-height tab-anv-list-right">
						<input type="text" v-model="formData.operational_field" placeholder="请输入">
					</view> -->
					<view @click="isoperational_field=!isoperational_field" class="flex-line-height flex-height-between tab-anv-list-right">
						<text v-if="formData.operational_field&&formData.operational_field.length">
							{{formData.operational_field.join()}}
						</text>
						<text v-else>请选择</text>
						<image class="img" :src="imgUrl+'/right.png'" mode=""></image>
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">期望行业</view>
					<view class="flex-line-height tab-anv-list-right">
						<input type="text" v-model="formData.desired_industry" placeholder="请输入">
					</view>
				</view>
				<view class="tab-anv-list flex-height-between">
					<view class="title">薪资要求(元/月)</view>
					<picker @change="chengsFun" :range="chengs">
						<view class="flex-line-height flex-height-between tab-anv-list-right">
							<view class="uni-input">{{formData.salary_requirement || '请选择' }}</view>
							<image class="img" :src="imgUrl+'/right.png'" mode=""></image>
						</view>
					</picker>
					<!-- <view class="flex-line-height tab-anv-list-right">
						<input type="text"  v-model="formData.salary_requirement" placeholder="请输入">
					</view> -->
				</view>
				
				
				
				
				<view class="footerButtom" @click="essentialInformation">提交</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	var currentdate="";
		function getNowFormatDate(){
		var date = new Date();
		var seperator1 = "-";
		var year = date.getFullYear();
		var month = date.getMonth() + 1;
		var day = date.getDate();
		if (month >= 1 && month <= 9) {
		month = "0" + month;
		}
		if (day >= 0 && day <= 9) {
		day = "0" + day;
		}
		var currentdate = year + seperator1 + month + seperator1 + day;
		return currentdate;
	}
	import pickerConter from "@/components/picker-conter.vue"
	 import cityPicker from '@/uni_modules/piaoyi-cityPicker/components/piaoyi-cityPicker/piaoyi-cityPicker'
	import {
		Request
	} from '@/utils/request.js'
	export default {
		components:{
			pickerConter,
			cityPicker
		},
		data(){
			return {
				 visible: false,
				maskCloseAble: true,
				str: '',
				imgUrl:this.imgUrl,
				// defaultValue: '',
				defaultValue: ['河北省','唐山市','丰南区'],
				column: 3,
				gender:[{name:"男"},{name:"女"}],
				gender:[{name:"男"},{name:"女"}],
				xueliScone:['小学','初中','高中（职高，高技、中专）','大专','本科','硕士研究生','博士研究生'],
				chengs:['不限','3k以下','3-5k','5-10k','10-20k','20-50k','50k以上'],
				dangUXns:['中共党员','中共预备党员','共青团员','民革党员','民盟盟员','民建会员','民进会员','农工党党员','致公党党员','九三学社社员','台盟盟员','无党派人士','群众'],
				genderIndex:0,
				date:'请选择',
				date2:'请选择',
				endDate:'',
				userInfoJson:{},
				formData:{
					current_residence:[],
					census_register:[],
					operational_field:[],
				},
				isCurrent_residence:false,
				iscensus_register:false,
				isoperational_field:false,
				// 小学
				// 初中
				// 中专/高中
				// 专科/本科
				// 硕士研究生
				// ‌博士研究生
				// 博士后，
				// nickname
				// [string]
				// 是
				// 昵称
				// avatar
				// [string]
				// 是
				// 头像
				// account
				// [string]
				// 是
				// 账号
				// name
				// [string]
				// 是
				// 姓名
				// email
				// [string]
				// 是
				// 邮箱
				// card_id
				// [string]
				// 是
				// 身份证号
				// full_name
				// [string]
				// 是
				// 真实姓名
				// gender
				// [string]
				// 是
				// 性别
				// birthday
				// [string]
				// 是
				// 生日
				// politics_status
				// [string]
				// 是
				// 政治面貌
				// current_residence
				// [string]
				// 是
				// 现居住地
				// census_register
				// [string]
				// 是
				// 户籍所在地
				// education
				// [string]
				// 是
				// 学历
				// graduate_time
				// [string]
				// 是
				// 毕业时间
				// expected_position
				// [string]
				// 是
				// 期望职位
				// operational_field
				// [string]
				// 是
				// 工作地区
				// desired_industry
				// [string]
				// 是
				// 期望行业
				// salary_requirement
				// [string]
				// 是
				// 期望薪资

				nickname:"",//姓名
				birth:"",//出生年月日
				face:'',
			}
		},
		onLoad() {
			this.endDate=getNowFormatDate();
			this.userInfo();
		},
		methods:{
		
			dangUXnsFun(e){
				this.formData.politics_status=this.dangUXns[e.detail.value];
			},
			chengsFun(e){
				this.formData.salary_requirement=this.chengs[e.detail.value];
			},
			funCsiy(e){
				console.log(e.detail.value)
				this.formData.education=this.xueliScone[e.detail.value];
			},
			confirm(val){
				let {provinceName,cityName,areaName}=val;
				this.formData.current_residence=[provinceName,cityName,areaName];
				this.formData={
					...this.formData
				}
				this.isCurrent_residence = false;
			},
			confirmcensus_register(val){
				let {provinceName,cityName,areaName}=val;
				this.formData.census_register=[provinceName,cityName,areaName];
				this.formData={
					...this.formData
				}
				this.iscensus_register= false;
			},
			confirmoperational_field(val){
				let {provinceName,cityName,areaName}=val;
				this.formData.operational_field=[provinceName,cityName,areaName];
				this.formData={
					...this.formData
				}
				this.isoperational_field = false;
			},
			
			
						
			useredit(){
				Request('/user/edit',{
					...this.formData
				},"post").then((res)=>{
					
					// this.userInfoJson=res;
				})
			},
			userInfo(){
				   Request('/user/info').then((res)=>{
					   this.userInfoJson=res;
					   
					   this.formData={
						   ...res,
						   current_residence:res.current_residence?res.current_residence.split(','):[],
						   census_register:res.census_register?res.census_register.split(','):[],
						   operational_field:res.operational_field?res.operational_field.split(','):[],
					   }
				   })
			},
			onChange(e){
				this.formData.gender=e.detail.value;
				this.genderIndex=e.detail.value;
			},
			bindDateChange(e){
				this.date=e.detail.value;
				this.formData.birthday=e.detail.value;
			},
			bindDateChange2(e){
				this.date2=e.detail.value;
				this.formData.graduate_time=e.detail.value;
			},
			essentialInformation(){
				// /api/user/edit
				console.log(this.formData.current_residence)
			
				this.formData.current_residence=this.formData.current_residence.join();
				this.formData.census_register=this.formData.census_register.join();
				this.formData.operational_field=this.formData.operational_field.join();
				//essentialInformation
				Request("user/edit",{
					...this.formData
				},'post').then((res)=>{
					uni.showToast({
					    title:'保存成功'
					})
					setTimeout(()=>{
						uni.navigateBack({ delta: 1 })
					},1000)
				})
			}
			// /api/user/curriculum_vitae/essentialInformation
		}
	}
</script>

<style scoped>
	.jiabnexixn{
		height: 56rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 40rpx;
		color: #0D0E0F;
		line-height: 56rpx;
		padding-top: 10rpx;
		text-align: left;
		font-style: normal;
		text-transform: none;
	}
	.tab-anv-list{
		border-bottom: 1px solid #E1E4E8;
		padding:32rpx 0;
	}
	.tab-anv-list .title{
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #0D0E0F;
		text-align: left;
		font-style: normal;
		text-transform: none;
	}
	.tab-anv-list .img{
		width: 20rpx;
		height: 20rpx;
	}
	.tab-anv-list .info{
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		margin-right: 24rpx;
		font-size: 28rpx;
		text-align: right;
		font-style: normal;
		text-transform: none;
	}
	.tiTuischu{
		height: 80rpx;
		background: #E26262;
		text-align: center;
		line-height: 80rpx;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #FFFFFF;
		font-style: normal;
		text-transform: none;
		margin-top: 20rpx;
	}
	.footerButtom{
		height: 80rpx;
		background: #3B5EEC;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 80rpx;
		margin-top: 70rpx;
		text-align: center;
		font-style: normal;
		text-transform: none;
	}
	.tab-anv-list .tab-anv-list-right{
		width: 500rpx;
		color: #0D0E0F !important;
	}
	.tab-anv-list .tab-anv-list-right .info{
		color: #0D0E0F !important;
	}
</style>